new Vue({
    el: "#app",
    data: {
        url: "",
        keyword: "海底",
        author:"",
        playState:false
    },

    methods: {
         /* 1.点击事件获取输入框中的值 */
        searchSongs(){
            let keyword = this.keyword;
            if(keyword){
                console.log(keyword);
                // 2.发送http请求
                let search_url = `http://localhost:3000/search?keywords=${keyword}&limit=1`;
                $.ajax({
                    url:search_url,
                    type:"get",
                    dataType:"json",
                    success:res=>{
                        //获取id
                        let id = res.result.songs[0].id;
                        console.log(id);
                        //获取作者
                        let author = res.result.songs[0].artists[0].name;
                        console.log(author);
                        //获取图片路径
                        let img1v1Url = res.result.songs[0].artists[0].img1v1Url;
                        console.log(img1v1Url);
                        
                        let playUrl = `https://music.163.com/song/media/outer/url?id=${id}`;
                        this.url = playUrl;
                        this.author = author;
                    }
                })
            }

        },
        play:function(){
            this.playState = true;
        },
        pause:function(){
            this.playState = false;
        }
      
    }


})